<template>
    <el-date-picker
        clearable
        placeholder="请选择"
        :disabled="disabled"
        :type="type"
        class="width_100 height_auto"
        :format="TimeFormat"
        :default-time="DefaultTime"
        v-model="state"
        @change="change"
        :disabled-date="disabledDateFun"
    />
</template>

<script setup lang="ts">

/**
 * @props
 */

const props = defineProps({
    // 值
    value: {
        type: String,
        default: ''
    },
    // 禁用状态
    disabled: {
        type: Boolean,
        default: false
    },
    // 类型
    type: {
        type: String,
        default: 'datetimerange', // year/month/date/dates/datetime/ week/datetimerange/daterange/ monthrange
    } as any,
    // 禁用日期范围[默认不禁用]
    disabledDateFun: {
        type: Function,
        default: () => {
            return false
        }
    }
})

/**
 * @var
 */

const state = toRef(props.value)
const DefaultTime: [Date, Date] = [
    new Date(2000, 1, 1, 0, 0, 0),
    new Date(2000, 2, 1, 23, 59, 59),
]
// 默认
const TimeFormat = 'YYYY-MM-DD HH:mm:ss'
/**
 * @method 
 */
const emit = defineEmits(['change'])
const change = (value: any) => {
    emit('change', value)
}

// const disabledDateFun = (time: Record<string, any>): boolean => {
//     if (time.getTime() > new Date(DefaultTime[1]).getTime()) {
//         return true;
//     } else {
//         return false;
//     }
// }

</script>

<style scoped></style>
